<div id="maincontent">
    <div id="invite">
        <div class="left">
            <div class="num-one">
                <div class="number">1</div>
                <div class="line"></div>
                <div class="copy">
                    <p>Copy the unique URL below and paste it into Facebook, Twitter, Google+ or an Email</p>
                    <p><input type="text" value="<?php echo $this->baseUrl() . "/user/view-profile/member/" . $this->userInfo->userId; ?>" class="link" id="link"/>
                    <a class="copy-link" href="javascript:void(0)">Copy link</a>
                    <a class="fb" href="javascript:void(request_dialog());">FB</a>
                    <a class="tw" href="https://twitter.com/share?url=%2Fpages%2Ftweet-button" target="_blank">TW</a>
                    <a class="gg" href="https://plus.google.com/share?url={<?php echo $this->baseUrl() . "/user/view-profile/member/" . $this->userInfo->userId; ?>}" target="_blank">GG</a></p>
                </div>
            </div>
            <div class="num-two">
                <div class="add">
                    <p>Add friend�s email addresses</p>
                    <form action="" method="post" id="frm_invite_via_mail">
                        <p><input type="email" value="Enter email adresses separated by commas" onblur="if (this.value=='') this.value='Enter email adresses separated by commas';" onfocus="if (this.value=='Enter email adresses separated by commas') this.value='';" name="email" class="inputbox" placeholder="Enter email adresses separated by commas"/>
                        <input type="button" value="send" class="submit button_invite_via_mail"/></p>
                    </form>
                </div>
                <div class="line"></div>
                <div class="number">2</div>
            </div>
            <div class="num-three">
                <div class="number">3</div><div class="clearfix"></div>
                <div class="line"></div>
                <div class="check">
                    <p>Check your Credits for what you have earned</p>
                    <ul class="para-color">
                        <li class="blue"></li>
                        <li class="sliver"></li>
                        <li class="gold"></li>
                    </ul>
                    <p class="txt-color"><span class="blue">Blue</span><span class="sliver">Silver</span><span class="gold">Gold</span></p>
                    <ul class="llist-color">
                        <li class="blue">
                            <h5>Blue</h5>
                            <p>10 Friends have joined. Unlimited Commenting</p>
                        </li>
                        <li class="sliver">
                            <h5>Silver</h5>
                            <p>25 Friends have joined. Enter Featured Contests</p>
                        </li>
                        <li class="gold">
                            <h5>Gold</h5>
                            <p>50 Friends have joined. Secret Goodie Package</p>
                        </li>
                        <li class="bonus">
                            <h5>Bonus</h5>
                            <p>Invited a potential winner and get 10.000$ Cash</p>
                        </li>
                    </ul>
                </div>                
            </div>
        </div>
        <div class="right">
            <h4 class="txt-tips">Some Tips</h4>
            <ul class="list-tips">
                <li class="row0"><p>Invite a potential Winner and win up to 10.000$</p></li>
                <li class="row1"><a href="#" title="">Registration is free</a></li>
                <li class="row2"><a href="#" title="">100% Secured</a></li>
                <li class="row3"><a href="#" title="">24 Hours online support</a></li>
                <li class="row4"><a href="#" title="">Customizable</a></li>
                <li class="row5"><a href="#" title="">Share your pic</a></li>                    
            </ul>
        </div>
        <div class="clearfix"></div>
        <div id="slideshow"> <!--slideshow-->   
            <h4 class="already">Already Invited (25)</h4>
            <div class="rows-2">          
                <ul id="mycarouse2" class="jcarousel-skin-tango">           
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>
                       <li><a href="#" title=""><img src="images/Clara-Alonso-Fashion-Model.jpg" alt="sfdf" />#72405 Michell</a></li>     
                </ul>
            </div>
        </div>
    </div>
</div>
<?php echo $this->headScript()->appendFile( $this->baseUrl() . "/js/jquery.zclip.min.js"); ?>
<script type="text/javascript">
jQuery(document).ready(function($){
	
	$('a.copy-link').zclip({
		path:'<?php echo $this->baseUrl();?>/js/ZeroClipboard.swf',
		copy:function(){ return $('input#link').val();}
	});

	$('input.button_invite_via_mail').click(function(){
		$.ajax({
			url : '<?php echo $this->baseUrl(); ?>/invite/invite-mail',
			type: "POST",
			dataType: "json",
	        data: $('#frm_invite_via_mail').serialize(),
	        beforeSend: function(jqXHR, settings){
	            
	        },
	        error: function(jqXHR, textStatus, errorThrown){
	            console.log( errorThrown );
	        },
	        success: function(response, textStatus, jqXHR){
		        if( response == true){
			        alert("Gửi mail mời bạn bè thành công");
		        }else{
		        	alert("Gửi mail mời bạn bè không thành công");
		        }
	        },
	        complete: function(jqXHR, textStatus){ }
		});
	});
});

function request_dialog(){
	FB.ui({method: 'apprequests',
		  message: 'My Great Request',
		  //to: {user-ids}
		  //redirect_uri : 'http://2pretty.idvnn.com'
		});
}

function feed_dialog(){
	
	FB.ui({
		  method: 'feed',
		  //link: 'https://developers.facebook.com/docs/reference/dialogs/',
		  //picture: 'http://fbrell.com/f8.jpg',
		  name: 'Facebook Dialogs',
		  caption: 'Reference Documentation',
		  description: 'Using Dialogs to interact with people.'
	}, function(response){});
}
</script>
<script type="text/javascript" src="<?php echo $this->baseUrl();?>/js/slide_bot/jquery.faded.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl();?>/js/slide_bot/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl();?>/js/slide_bot/slideoption.js"></script>
